#share-toast {

    position: fixed;
    top: 30px;
    right: 50%; 
    transform: translateX(50%);     /* centers the share-toast */
    
    font-size: clamp(1rem, 3vw, 2rem); 
    text-align: center;
    line-height: 1.5em;

    width: 55%;
    
    /* min and max control the responsive range between cell phone and computer screen */
    min-width: 300px;   
    max-width: 475px;

    padding: 0.5em 1em;
    border-radius: 8px;
    z-index: 9999;

    background-color: #333;
    color: white;
    
    opacity: 0;
    pointer-events: none;
    transition: opacity 1s ease;
}

#share-toast.show {
    opacity: 1;
}